<meta charset="utf-8"/>
<div class="row">
  <div class="col-xs-12">
    <div class="row">
      <div class="col-xs-12">
        <div class="clearfix" style="height:42px;">
          <table class="no-border" style="display:inline">
            <tr>
              <td permission='userAccount_btn_listData' style="padding: 0px 6px;display:none">
                登录账号
              </td>
              <td permission='userAccount_btn_listData' style="display:none">
                <div class="input-group">
                  <input type="text" id="key_user_name" class="form-control search-query" placeholder="登录账号" style="width:140px"/>
                </div>
              </td>
              <td permission='userAccount_btn_listData' style="padding: 0px 6px;display:none">
                事业部选项
              </td>
              <td permission='userAccount_btn_listData' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn">
                    <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle col-sm-12" style="margin-left:0.01em;">
                      <span id="searchDropdowndeleted">全部身份</span>
                      <i class="ace-icon fa fa-angle-down"></i>
                    </button>
                    <ul class="dropdown-menu col-sm-12" style="margin-left:-1px;width:99px;min-width:99px;">
                      <li>
                        <a href="javascript:winFn.dropdown('#key_category','','#searchDropdowndeleted','全部身份');">全部身份</a>
                      </li>
                      <li>
                        <a href="javascript:winFn.dropdown('#key_category','1','#searchDropdowndeleted','是事业部');">是事业部</a>
                      </li>
                      <li>
                        <a href="javascript:winFn.dropdown('#key_category','0','#searchDropdowndeleted','非事业部');">非事业部</a>
                      </li>
                    </ul>
                    <input id="key_category" type="hidden"/>
                  </span>
                </div>
              </td>
              <td permission='userAccount_btn_listData' class="hidden-480" style="padding: 0px 6px;display:none">
                账号状态
              </td>
              <td permission='userAccount_btn_listData' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn">
                    <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle col-sm-12" style="margin-left:0.01em">
                      <span id="searchDropdownenabled">全部</span>
                      <i class="ace-icon fa fa-angle-down"></i>
                    </button>
                    <ul class="dropdown-menu col-sm-12" style="margin-left:-1px;width:71px;min-width:71px;">
                      <li>
                        <a href="javascript:winFn.dropdown('#key_enabled','','#searchDropdownenabled','全部');">全部</a>
                      </li>
                      <li>
                        <a href="javascript:winFn.dropdown('#key_enabled','0','#searchDropdownenabled','正常');">正常</a>
                      </li>
                      <li>
                        <a href="javascript:winFn.dropdown('#key_enabled','1','#searchDropdownenabled','禁用');">禁用</a>
                      </li>
                    </ul>
                    <input id="key_enabled" type="hidden"/>
                  </span>
                  <span class="input-group-btn">
                    <button type="button" class="btn btn-inverse btn-white" id="btnSearch">
                      <span class="ace-icon fa fa-search bigger-110"></span>
                      搜索
                    </button>
                  </span>
                </div>
              </td>
              <td permission='userAccount_btn_add' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn">
                    <button type="button" class="btn btn-inverse btn-white" id="btnAdd">
                      <span class="ace-icon glyphicon glyphicon-plus bigger-110"></span>
                      添加
                    </button>
                  </span>
                </div>
              </td>
            </tr>
          </table>
          <div class="hidden-480 pull-right tableTools-container" permission='userAccount_btn_listData' style="display:none"></div>
        </div>
        <table id="tableListUserAccount" class="table table-striped table-bordered table-hover"></table>
      </div>
    </div>
  </div>
</div>
<div id="div_sys_user_edit" style="display:none;padding-top:2px;margin-bottom:-20px;">
  <form class="form-horizontal" id="form_sys_user_edit" role="form">
    <label class="col-sm-3 control-label no-padding-right" for="user_name">
      <div class="hr-4"></div>登录账号
    </label>
    <div class="col-sm-7">
      <div class="hr-4"></div>
    <input type="text" id="user_name" placeholder="登录账号" class="form-control" maxlength="64" readonly="readonly"/>
    </div>
    <label class="col-sm-3 control-label no-padding-right" for="password">
      <div class="hr-4"></div>账号密码
    </label>
    <div class="col-sm-7">
      <div class="hr-4"></div>
    <input type="text" id="password" placeholder="账号密码" class="form-control" maxlength="64"/>
    </div>
  </form>
</div>
<div id="divKeyColumns" style="display:none;padding:1px 0px;"></div>
<input type="hidden" id="sys_user_edit_keyId"/>
<div style="display:none;">
  <input type="hidden" id="userAccount_btn_listData"/>
  <input type="hidden" id="userAccount_btn_add"/>
  <input type="hidden" id="userAccount_row_edit"/>
  <input type="hidden" id="userAccount_row_queryById"/>
  <input type="hidden" id="userAccount_row_queryLogin"/>
  <input type="hidden" id="userAccount_row_editEnabled"/>
</div>
<div id="div_category" style="display:none;padding:2px">
  <form class="form-horizontal" role="form">
    <div class="input-group">
      <span class="input-group-btn">
        <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle col-sm-12" style="margin-left:0.01em">
          <span id="dropdown_select_category">选择选项</span>
          <i class="ace-icon fa fa-angle-down"></i>
        </button>
        <ul class="dropdown-menu col-sm-12" style="margin-left:-1px">
          <li>
            <a id="category_" href="javascript:winFn.dropdown('#opts_category','','#dropdown_select_category','选择选项');">选择选项</a>
          </li>
          <li>
            <a id="category1" href="javascript:winFn.dropdown('#opts_category','1','#dropdown_select_category','是事业部');">是事业部</a>
          </li>
          <li>
            <a id="category0" href="javascript:winFn.dropdown('#opts_category','0','#dropdown_select_category','非事业部');">非事业部</a>
          </li>
        </ul>
        <input id="opts_category" type="hidden"/>
      </span>
    </div>
  </form>
</div>
<script type="text/javascript">
  var scripts = [null, null];
  $('.page-content-area').ace_ajax('loadScripts', scripts, function(){
    var tableDom = '#tableListUserAccount';
    var inputEditKeyId = '#sys_user_edit_keyId';
    $(function(){
      var urlRoute = '/userAccount/';/*请求controller层的url*/
      var getList = urlRoute + 'listData';/*获取数据列表*/
      var urlAdd = urlRoute + 'add';/*添加*/
      var urlEdit = urlRoute + 'edit';/*编辑*/
      var urlEditEnabled = urlRoute + 'editEnabled';/*控制启禁用*/
      var urlQueryById = urlRoute + 'queryById';/*根据id查询对应的数据*/
      var urlQueryLogin = urlRoute + 'queryLogin';/*切换登录账号*/
      var thisTable = pageDataTable.initDataTable({
        tableDom : tableDom,
        sAjaxSource : getList,
        fnServerParams : function(params){
          params.push({"name": "user_name", "value": $("#key_user_name").val()},{"name": "enabled", "value": $("#key_enabled").val()},{"name": "category", "value": $("#key_category").val()});
        },
        aoColumns : [
          {
            bSortable : false,
            mData : "kid",
            sWidth : "36px",
            sClass : "center",
            visible : true,
            sTitle : '<label title="序号" style="color:#000;font-size:13px;font-weight:normal">序号</label>'
          }, 
          {
            mData : "user_name",
            sTitle : "登录账号",
            sWidth: "8%"
          },
          {
            mData : "real_name",
            sTitle : "昵称姓名"
          },
          {
            mData : "sex",
            sTitle : "性别",
            sWidth: "95px",
            render : function(value,type,row,meta){
              if(value === 1){
                return '男生';
              }else if(value === 2){
                return '女生';
              }else if(value === 3){
                return '未知';
              }else{
                return "";
              }
            }
          },
          {
            mData : "category",
            sTitle : "事业部选项",
            sWidth: "100px",
            render : function(value,type,row,meta){
              if(value === 0){
                return '非事业部';
              }else if(value === 1){
                return '是事业部';
              }else{
                return "";
              }
            }
          },
          {
            mData : "enabled",
            sTitle : "状态",
            sWidth: "95px",
            render : function(value,type,row,meta){
              if(value === 0){
                return '正常';
              }else if(value === 1){
                return '禁用';
              }else{
                return "";
              }
            }
          },
          {
            mData : "add_date",
            sTitle : "注册时间",
            sWidth: "122px"
          },
          {
            mData : "logintime",
            sTitle : "最近登录时间",
            sWidth: "122px"
          }, 
          {
            mData : "_kid_",
            sTitle : "<label style='color:#000;margin-left:6px;' title='单行操作'>操作选项</label>",
            bSortable : false,
            visible : true,
            sWidth: "146px"
          }
        ],
        columnDefs : [
          {
            targets : 0,//指定的列
            render : function(value,type,row,meta){
              return '<label >'+(meta.row < 9 ? '0'+(meta.row+1) : (meta.row+1))+'</label>';
            }
          },
          {
            targets : -1, render: function(value, type, row, meta){
              return "<a href='javascript:thisPage.rowEdit(" + meta.row + ");' style='outline:none;text-decoration: none;color:#3b8cff;margin-left:6px;display:none' permission='userAccount_row_edit'>编辑</a>" +
                "<a title='"+(row.enabled === 0 ? "冻结禁用":"正常启用")+"' href='javascript:thisPage.rowDisable("+meta.row+");' style='outline:none;text-decoration: none;color:#33a3dc;margin-left:6px;display:none' permission='userAccount_row_editEnabled'>"+(row.enabled === 0 ? "禁用":"启用")+"</a>" +
                "<a href='javascript:thisPage.optsCategory("+meta.row+");' style='outline:none;text-decoration: none;color:#00ae9d;margin-left:6px;display:none' permission='userAccount_row_edit'>事业部选项</a>";
            }
          },
          {
            targets : [1,2,3,4,5,6], render: function(value, type, row, meta){
              return pageDataTable.formatColumn(value);
            }
          },
          {
          visible : false,//列的隐藏显示
          targets : []//指定列
          }
        ]
      });
      pageDataTable.buttons(thisTable,[]);
      pageDataTable.action(thisTable);
      pageDataTable.select(thisTable, tableDom);
      pageDataTable.tooltip();
      var thisJquery = $(tableDom).dataTable();
      thisPage = {
        init: function(){
          this.addEvent();
        },
        initDom: function(){
        },
        createDropdown: function(){
        },
        addEvent: function(){
          this.btnEvent();
        },
        btnEvent: function(){
          $(tableDom + ' tbody').on('dblclick', 'tr', function(){
            if(verifyFn.inputRequired('#userAccount_row_edit')){
              return;
            }
            thisPage.trDblclick(thisTable.row(this).data());
          });
          $('#btnAdd').on('click', function(){
            thisPage.edit();
          });
          //搜索按钮
          $('#btnSearch').on('click', function(){
            thisPage.search();
          });
          //按钮组-自定义显示列
          $('#iconColumn').parent().parent().on('click', function(){
            pageDataTable.columnCustom(thisTable, tableDom, '#divKeyColumns');
          });
          //按钮组-搜索
          $('#iconRefresh').parent().parent().on('click', function(){
            thisPage.search();
          });
        },
        trDblclick: function(data){
          thisPage.edit(data.kid);
        },
        search: function(){
          if(verifyFn.inputCheck('#userAccount_btn_listData', '没有操作权限')) return;
          $(tableDom + '_wrapper table input[type=checkbox]').prop('checked', false);
          thisTable.draw();
        },
        resetForm: function(){
          winFn.clearFormData('#form_sys_user_edit');
        },
        edit: function(kid){
          var title = '添加';
          if(kid != null && kid.length > 0){
            if(verifyFn.inputCheck('#userAccount_row_queryById', '没有操作权限')) return;
            title = '编辑-重置密码';
            winFn.setDomValue(inputEditKeyId, kid);
            layerFn.queryByIdHint(urlQueryById, kid, function(data){
              thisPage.openDialog(title, kid, data);
            });
          }else{
            winFn.setDomValue(inputEditKeyId, '');
            thisPage.openDialog(title);
          }
        },
        openDialog: function(title, kid, map){
          var url = urlAdd;
          if(kid != null && kid.length > 0){
            url = urlEdit;
            if(verifyFn.inputCheck('#userAccount_row_edit', '没有编辑权限')) return;
          }else{
            if(verifyFn.inputCheck('#userAccount_btn_add', '没有添加权限')) return;
          }
          layerFn.addOrEdit(title, '#div_sys_user_edit', ['380px', '164px'], function(index,layero){
            if(verifyFn.inputCheck('#user_name', '登录账号不能为空')) return;
            if(verifyFn.inputCheck('#password', '账号密码不能为空')) return;
            var params = {
              user_name : winFn.getDomValue('#user_name'),
              password : winFn.getDomValue('#password'),
              kid : winFn.getDomValue(inputEditKeyId)
            };
          layerFn.submit(url, params, function(data){
            thisPage.complete(data, index, true);
          });
          });
          thisPage.resetForm();//清空
          if(map != null){
            $.each(map.data, function(k, v){
              try{
                $('#' + k).val(v);
              }catch(e){}
            });
          }
        },
        optsCategory : function(index){
          if(verifyFn.inputCheck('#userAccount_row_edit','没有操作权限')) return;
          var row = thisJquery.fnGetData(index);
          layerFn.addOrEdit('['+row.user_name+']事业部选项','#div_category',['270px','220px'],function(layerIndex){
            if(verifyFn.inputCheck('#opts_category','请选择事业部选项')) return;
            var optCategory = winFn.getDomValue('#opts_category');
            var params = {
              kid : row.kid,
              category : optCategory
            };
            var msg = optCategory == 1 ? '确定要设为事业部成员吗？' : '确定要取消事业部成员吗？';
            layerFn.confirm(msg,function(){
              layerFn.submit(urlEdit,params,function(data){
                thisPage.complete(data,layerIndex,true);
              });
            });
          });
          winFn.dropdown('#opts_category',row.category);
          winFn.editDropdown('#dropdown_select_category','category' + row.category);
        },
        rowEdit: function(index){
          var row = thisJquery.fnGetData(index);
          thisPage.edit(row.kid);
        },
        /*启用禁用*/
        rowDisable : function(index){
          if(verifyFn.inputRequired('#userAccount_row_editEnabled')){
            layerFn.alert('没有操作权限',AppKey.code.code199);
            return;
          }
          var row = thisJquery.fnGetData(index);
          var enabled = row.enabled;
          var msg = '禁用';
          var disable = 1;
          if(enabled == 1){
            msg = '启用';
            disable = 0;
          }
          layerFn.confirm('是否要对账号<br/>'+'<span style="color:#1e9fff">'+row.user_name+'</span><br/>进行<span style="color:#1e9fff">'+msg+'</span>操作吗？',function(){
            layerFn.submit(urlEditEnabled,{enabled:row.enabled,userId:row.kid,disable:disable},function(data){
              thisPage.complete(data,null,true);
            });
          });
        },
        rowLogin : function(index){
          if(verifyFn.inputRequired('#userAccount_row_queryLogin')){
            layerFn.alert('没有操作权限',AppKey.code.code199);
            return;
          }
          var row = thisJquery.fnGetData(index);
          layerFn.confirm('是否要切换到账号<br/><span style="color:#1e9fff">'+row.user_name+'</span><br/>进行登录操作吗？',function(){
            layerFn.submit(urlQueryLogin,{userId:row.kid},function(data){
              //存储token再跳转
              var obj = data.data;
              sessionStorage.setItem("accessToken",obj.accessToken);
              sessionStorage.setItem("refreshToken",obj.refreshToken);
              sessionStorage.setItem("currentLoginUser",row.user_name);
              sessionStorage.setItem("btnRows",JSON.stringify(obj.btnRows));
              var menuData = obj.menuData;
              if(menuData != null && menuData != ''){
                sessionStorage.setItem("menuData",menuData);
                winFn.winOpen('/main.html');
              }else{
                sessionStorage.clear();
                layerFn.closeEvent('已登录的账号没有操作权限',AppKey.code.code199,function(){
                  winFn.winOpen('/index.html');
                });
              }
            });
          });
        },
        complete: function(data, index, search){
          try{
            if(index){
              layerFn.closeIndex(index);
            }
            if(search){
              thisPage.search();
            }
            if(data){
              layerFn.handleResult(data.msg, data.code);
            }
          }catch(e){}
        }
      };
      thisPage.init();
      $('script').remove();
    });
  });
</script>